<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
   <style>
       *{
           box-sizing: border-box;
           margin: 0;
           background-color: black;
       }

.container{
    width: 700px;
    height: 700px;
    margin: 0 auto;
    position: relative;
    animation: heartbeat 1.5s infinite alternate;
}
.child{
    width : 400px;
    height: 300px;
    background-color: red;
    border-radius: 50%;
    position: absolute;
}
.left{
    left: 40px;
}
.right{
    right: 40px;
}
.bottom{
    width : 350px;
    height: 350px;
    background-color: red;
    position: absolute;
    top: 90px;
    left: 155px;
    transform:
     rotate(48deg);
}
@keyframes heartbeat {
            from{}
            to{
                transform: scale(1.2);
            }
        }
   </style>
</head>
<body>
    <div class="container">

    <div class="child left"></div>
    <div class="child right"></div>
    <div class="bottom"></div>
</div>
</body>
</html>